<template>
    <span>{{ n.number.toFixed(0) }}</span>
</template>
<script setup lang='ts'>
import gsap from 'gsap'
import { watch, reactive, onMounted } from 'vue'
const props = defineProps({
    num: {
        type: Number,
        default: 0
    }
})

const n = reactive({
    number: 0
})

const countTo = () => {
    gsap.to(n, {
        duration: 1,
        number: props.num
    })
}
watch(
    () => props.num,
    () => {
        countTo()

    })
onMounted(() => {
    countTo()

})
</script>
<style lang='scss' scoped>

</style>